<!doctype html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Simple Scrollbar</title>
  <script src="lib/simple-scrollbar.js"></script>
  <link rel="stylesheet" href="lib/simple-scrollbar.css">
  <style>
    body {
      padding: 20px;
    }

    section {
      border: 1px solid red;
      width: 80%;
      height: 300px;
      margin: 20px auto;
    }
  </style>
</head>
<body>

<section ss-container>
  <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium aliquid consequuntur natus nisi nobis
    numquam qui quibusdam sapiente! Aliquid dolore, dolorem ducimus ipsam quas quidem quo voluptate. Cupiditate, hic,
    sint?</p>
  <p>Blanditiis deleniti earum ex ipsa ipsam omnis pariatur placeat temporibus vel, voluptatum? Alias beatae corporis
    deleniti eius exercitationem explicabo ipsum magni molestias optio porro recusandae saepe, sed tempora, vel
    velit!</p>
  <p>Asperiores autem corporis doloremque dolorum ducimus ea eaque eligendi error est impedit ipsa magni, maiores
    nemo, officia perferendis porro reiciendis reprehenderit sapiente similique totam vel velit vero. Accusamus, enim,
    pariatur.</p>
  <p>Ad atque aut deleniti esse facere illo iste modi natus nesciunt odio perferendis quae quas quidem vel,
    voluptates. Ad aliquid consequuntur deserunt enim in iusto neque quas suscipit velit voluptate?</p>
  <p>Atque deserunt fugiat incidunt qui saepe vel. Deserunt est fugit impedit nihil nostrum perferendis placeat rem
    repellendus vitae. Amet eum ipsam iste laborum maxime non odio odit quasi quia ullam.</p>
  <p>Accusamus adipisci amet, aperiam architecto consectetur cum dicta dolor earum eligendi eos facilis in laborum nam
    nesciunt non, nostrum numquam odit officia quaerat, quas reiciendis repudiandae sint. Dolor, optio,
    voluptatibus.</p>
  <p>Ad aut doloribus, ea fuga id vel voluptate! Alias architecto atque aut consequatur dolores, esse, fugiat illo,
    ipsa nihil officia optio quae quos reiciendis sit temporibus! Aliquam iste nobis odit!</p>
  <p>Aperiam architecto assumenda beatae consectetur dolorum eius excepturi ipsum maxime nobis numquam omnis quis
    sapiente, suscipit! Aliquam corporis delectus fugit molestias nihil nisi non perspiciatis. Explicabo, incidunt
    quam. Iste, tenetur.</p>
  <p>Assumenda cum deserunt, dignissimos esse fugit incidunt magnam minus molestiae nisi pariatur placeat praesentium,
    quia quibusdam totam ullam! Amet eaque earum facilis fuga quam quasi quisquam sapiente vel voluptate
    voluptates.</p>
  <p>Ea eaque, eligendi explicabo in magni modi perferendis unde voluptatum. Fugit magni nemo pariatur quis repellat
    voluptates? Aliquam amet cum, cumque, inventore labore laborum, minima neque quam quidem quisquam vero.</p>
  <p>Adipisci aperiam dignissimos explicabo perspiciatis sed suscipit unde velit voluptas! A distinctio illum itaque
    officiis sint tenetur ullam ut. At blanditiis dignissimos doloremque facilis id minima rerum similique soluta
    velit?</p>
  <p>A amet at culpa deserunt dicta dolorum fugiat fugit itaque libero, maxime, nisi non quod rem, repellendus sunt
    vitae voluptatem! Animi facilis iste laborum magni officiis quidem vel, veritatis vero?</p>
  <p>Adipisci aliquam amet animi consectetur cupiditate doloremque ea eligendi error, facilis id maiores nobis nostrum
    quidem quos repellat, saepe sit vero voluptatem voluptates voluptatum! Aut et facilis magni nobis non?</p>
  <p>Atque cumque delectus ea eveniet harum in libero, maxime molestiae neque nihil possimus suscipit unde velit
    veniam veritatis? Blanditiis commodi corporis dignissimos, dolorem eaque illo nobis porro quo recusandae
    reprehenderit!</p>
  <p>Accusantium adipisci alias atque exercitationem expedita facere fuga id ipsa iure nihil odio officia porro qui
    quidem quos recusandae repellat sapiente suscipit ullam veritatis vero, voluptatem, voluptatum! Necessitatibus,
    optio veniam.</p>
  <p>Aliquid, assumenda consequuntur corporis dicta distinctio doloribus dolorum enim et fugiat ipsam ipsum magnam
    molestiae mollitia natus neque obcaecati praesentium quae reprehenderit sed sequi temporibus totam vero voluptate
    voluptates voluptatum.</p>
  <p>Adipisci animi, architecto atque aut consequuntur culpa deserunt doloribus ducimus eos eveniet fuga fugit labore
    molestiae molestias mollitia nobis perspiciatis quae quidem quisquam rem similique tenetur ullam voluptatum?
    Aliquam, doloremque.</p>
  <p>Asperiores culpa exercitationem omnis ratione totam. Accusamus culpa dolorem fuga maxime, nihil pariatur possimus
    repudiandae unde. Accusamus dolore dolores harum nam optio praesentium quam quibusdam suscipit, vitae. Consectetur
    cupiditate, eligendi.</p>
  <p>Dolore doloremque eos, exercitationem expedita molestiae repellendus vero! Ab ad commodi distinctio earum
    eligendi error et eveniet hic impedit laboriosam maiores molestiae neque odio omnis, praesentium repudiandae
    sapiente sint ullam?</p>
  <p>Dolore facilis inventore ipsa nobis. Ad assumenda delectus dolorem facere fugit illo ipsum laborum laudantium
    libero magni minus modi nihil numquam officiis praesentium quo quos reiciendis repudiandae saepe, temporibus
    vel.</p>
</section>
<section ss-container>
  <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium aliquid consequuntur natus nisi nobis
    numquam qui quibusdam sapiente! Aliquid dolore, dolorem ducimus ipsam quas quidem quo voluptate. Cupiditate, hic,
    sint?</p>
  <p>Blanditiis deleniti earum ex ipsa ipsam omnis pariatur placeat temporibus vel, voluptatum? Alias beatae corporis
    deleniti eius exercitationem explicabo ipsum magni molestias optio porro recusandae saepe, sed tempora, vel
    velit!</p>
  <p>Asperiores autem corporis doloremque dolorum ducimus ea eaque eligendi error est impedit ipsa magni, maiores
    nemo, officia perferendis porro reiciendis reprehenderit sapiente similique totam vel velit vero. Accusamus, enim,
    pariatur.</p>
</section>

<script>
  window.onload = function () {
    new simpleScrollbar.default();
  }
</script>
</body>
</html>
